<template>
    <div class="main">
        <div class="first">
            <h1>合格投资者认定</h1>
            <div class="from">
               <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="200px" class="demo-ruleForm">
                <!-- <el-form-item label="姓名" prop="name">
                    <el-input v-model="ruleForm.name" placeholder="请输入姓名"></el-input>
                </el-form-item> -->
                <!-- <el-form-item label="身份证号" prop="card">
                    <el-input v-model="ruleForm.card" placeholder="请输入身份证号"></el-input>
                </el-form-item> -->

                 <el-form-item label="基金交易实际控制人" prop="region">
                    <el-select v-model="ruleForm.controller">
                    <el-option label="本人" value="本人"></el-option>
                    <el-option label="他人" value="他人"></el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="交易实际受益人" prop="region">
                    <el-select v-model="ruleForm.beneficiary">
                    <el-option label="本人" value="本人"></el-option>
                    <el-option label="他人" value="他人"></el-option>
                    </el-select>
                </el-form-item>
 
                <el-form-item label="是否有不良诚信记录" prop="region">
                    <el-select v-model="ruleForm.bad">
                    <el-option label="否" value="否"></el-option>
                    <el-option label="是" value="是"></el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="税收居民身份" prop="region">
                    <el-select v-model="ruleForm.tax">
                    <el-option label="仅为中国税收居民" value="仅为中国税收居民"></el-option>
                    <el-option label="仅为非居民" value="仅为非居民"></el-option>
                    <el-option label="中国税收居民&其他国家（地区）税收居民" value="中国税收居民&其他国家（地区）税收居民"></el-option>
                    </el-select>
                </el-form-item>

                 <div class="submit">
                        <el-button class="submitbutton" type="warning" @click="submitUserInfo('ruleForm')">提    交</el-button>                        
                </div>
                <div class="tiaokuan">
                    <p>
                         <el-checkbox v-model="checked1">本人确定是为自己购买私募基金产品, 资金来源合法，没有汇集他人资金，实际控制人和受益人均为本人。</el-checkbox>
                    </p>
                    <p>
                         <el-checkbox v-model="checked2">本人认定已符合以下条件中的一项</el-checkbox>  
                    </p>
                
                    <p class="tiaokuan-detail">·最近三年个人年均收入不低于50万元</p>
                    <p class="tiaokuan-detail">·本人承诺符合金融资产不低于300万元（金融资产包括银行存款、股票、债券、基金份额、资产管理计划、银行理财产品、信托计划、保险产品、期货权益等）。</p>
                </div>
                </el-form>
            </div>
        </div>
    </div>
</template>
<script>
    import api from '../../static/js/api'
    export default {
    data() {
        var validateCode = (rule, value, callback) => {
        if (value === "") {
            callback(new Error("请输入身份证号"));
        } else if (!/^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/.test(value)) {
            callback(new Error("请输入正确身份证号!"));
        } else {
            callback();
        }
        };
      return {
        checked1: true,
        checked2: true,
        ruleForm: {
          // name: '',
          card: '',
          controller: '本人',
          beneficiary: '本人',
          bad: '否',
          tax:'仅为中国税收居民'
        },
        rules: {
          // name: [
          //   { required: true, message: '请输入姓名', trigger: 'blur' },
          //   { min: 2, max: 6, message: '长度在 2 到 6 个字符', trigger: 'blur' }
          // ],
         // card: [{required: true, validator: validateCode, trigger: "blur" }],
        }
      };
    },
    methods: {
      submitUserInfo(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
              api.commitUserInfo(
                {
                  token:this.$store.state.userinfo.token,
                  idNum:this.ruleForm.card,
                  controlMan:this.ruleForm.controller,
                  incomeMan:this.ruleForm.beneficiary,
                  hasBadRecord:this.ruleForm.bad,
                  peopleStatus:this.ruleForm.tax
                }).then((res) =>{
                  if(res.code == 1){
                      this.$router.push("scoretest")
                  }else{
                    this.$alert("操作失败，请稍后再试")
                  }
                })
          } else {
              this.$alert("请填写相关信息")
              //  document.body.scrollTop = document.documentElement.scrollTop = 0;
          }
        });
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.main {
  min-width: 1000px;
  width: 90%;
  border: 1px solid #cccccc;
  padding: 30px 0;
  margin: 20px auto;
  background: white;
}
.first h1 {
  text-align: center;
  font-size: 18px;
  font-weight: bolder;
  margin-bottom: 30px;
}
.first .from {
  width: 500px;
  margin: 0 auto;
}
.first .tiaokuan {
  margin-top: 20px;
  line-height: 1.3;
}
.first .tiaokuan-detail {
  text-indent: 2rem;
}
.first .submit {
  text-align: center;
}
.first .submit button {
  width: 50%;
}

</style>
